<template>
  <div>
    <el-dialog v-model="visible" :title="title" width="50%">
      <el-form :model="form">
        <el-form-item label="单位名称" :label-width="formLabelWidth">
          <el-input v-model="form.unitName" />
        </el-form-item>
        <el-form-item label="单位地址" :label-width="formLabelWidth">
          <el-input v-model="form.unitAddress" />
        </el-form-item>
        <el-form-item label="营业执照" :label-width="formLabelWidth">
          <my-upload v-model="form.businessLicense" />
        </el-form-item>
        <el-form-item label="统一社会信用代码" :label-width="formLabelWidth">
          <el-input v-model="form.creditCode" />
        </el-form-item>
        <el-form-item label="单位简介" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="form.introduction" />
        </el-form-item>
        <el-form-item label="主营业务" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="form.mainBusiness" />
        </el-form-item>
        <el-form-item label="注册时间" :label-width="formLabelWidth">
          <el-date-picker v-model="form.registrationTime" type="datetime" />
        </el-form-item>
        <el-form-item label="注册资金(万)" :label-width="formLabelWidth">
          <el-input-number v-model="form.registeredCapital" :precision="0" :step="10" />
        </el-form-item>
        <el-form-item label="入会申请表" :label-width="formLabelWidth">
          <el-upload
              class="file-uploader"
              action="/api/common/upload"
              :headers="headers"
              :on-success="handleApplicationFormSuccess"
              :limit="1"
              :on-exceed="handleExceed"
              :file-list="form.applicationForm2"
              style="width: 100%;"
          >
            <el-button type="primary">选择文件</el-button>
            <template #tip>
              <div class="el-upload__tip">只能上传一个文件</div>
            </template>
          </el-upload>
        </el-form-item>
        <el-form-item label="联系人姓名" :label-width="formLabelWidth">
          <el-input v-model="form.contactName" />
        </el-form-item>
        <el-form-item label="联系人电话" :label-width="formLabelWidth">
          <el-input v-model="form.contactPhone" />
        </el-form-item>
        <el-form-item label="联系人职务" :label-width="formLabelWidth">
          <el-input v-model="form.contactPosition" />
        </el-form-item>
        <el-form-item label="联系人邮箱" :label-width="formLabelWidth">
          <el-input v-model="form.contactEmail" />
        </el-form-item>
        <el-form-item label="状态" :label-width="formLabelWidth" >
          <el-select v-model="form.status" placeholder="请选择状态" disabled="disabled">
            <el-option label="待审核" :value="1" />
            <el-option label="拒绝" :value="2" />
            <el-option label="同意" :value="3" />
            <el-option label="会员" :value="4" />
          </el-select>
        </el-form-item>
        <el-form-item label="发票" :label-width="formLabelWidth">
          <el-upload
              class="file-uploader"
              action="/api/common/upload"
              :headers="headers"
              :on-success="handleInvoiceSuccess"
              :limit="1"
              :on-exceed="handleExceed"
          >
            <el-button type="primary">点击上传</el-button>
            <template #tip>
              <div class="el-upload__tip">只能上传一个文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="visible = false">取消</el-button>
          <el-button type="primary" @click="submitForm">确认</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import {ref,defineEmits} from 'vue'
import {ElMessage, ElMessageBox} from "element-plus";
import {Plus} from "@element-plus/icons-vue";
import {addAssociationCouncil,updateAssociationCouncil} from '../api/guild/associationCouncil'
import BsApply from '../api/guild/bsApply';
import MyUpload from "../components/MyUpload.vue";


const headers = {
  token: localStorage.getItem('token')
}

const visible = ref(false)
const title=ref('')
const formLabelWidth = '140px'


// 表单默认值
let defaultForm = {
  id: '',
  openid: '',
  unitName: '',
  unitAddress: '',
  businessLicense: '',
  creditCode: '',
  introduction: '',
  mainBusiness: '',
  registrationTime: null,
  registeredCapital: null,
  applicationForm:'',
  applicationForm2: [],
  contactName: '',
  contactPhone: '',
  contactPosition: '',
  contactEmail: '',
  status: 1,
  invoice: ''
}

let form = ref(defaultForm)

//新增
function add(){
  //重置表单
  form.value = {...defaultForm}
  visible.value = true
  title.value='新增申请纪录'
}

//编辑
function edit(row){
  console.log("edit",row)
  visible.value = true
  title.value='编辑申请纪录'
  form.value = row
}

//定义触发器
let emit = defineEmits(['refresh'])

async function submitForm(){
  try {
    await ElMessageBox.confirm(
        '确定提交吗?',
        '重要提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }
    )
    try {
      let formData = JSON.parse(JSON.stringify(form.value))

      let result
      //判断编辑还是新增
      if(formData.id){
        result = await BsApply.edit(formData)
      }else{
        result =await BsApply.add(formData)
      }
      ElMessage.success(result.data.data)
      visible.value = false
      //通知父组件更新数据
      emit('refresh')
    } catch (e) {
      console.log("e",e)
      ElMessage.error(e)
    }
  } catch (e) {

  }
}


// 处理入会申请表上传成功
function handleApplicationFormSuccess(response: any, uploadFile: any) {
  if (response.code === 200) {
    if (!form.value.applicationForm2){
      form.value.applicationForm2 = []
    }
    form.value.applicationForm2.push(uploadFile); // 更新文件列表
    ElMessage({ message: "入会申请表上传成功", type: "success" });
  } else {
    ElMessage({ message: "入会申请表上传失败", type: "warning" });
  }
}

// 处理发票上传成功
function handleInvoiceSuccess(response: any, uploadFile: any) {
  if (response.code === 200) {
    form.value.invoice = response.data;
    ElMessage({ message: "发票上传成功", type: "success" });
  } else {
    ElMessage({ message: "发票上传失败", type: "warning" });
  }
}


// 文件超出个数限制时的处理
function handleExceed(files: File[], fileList: File[]) {
  ElMessage.warning(`只能上传一个文件`);
}


//暴露出去
defineExpose({
  add,
  edit,
})

</script>

<style  scoped>
.avatar{
  width: 178px;
  height: 178px;
  display: block;
}
</style>
